<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>滚动条1</title>
    <style type="text/css">
body{
    height: 8000px;
}
        div input {
            width: 538px;
            height: 38px;
            border: 1px solid #ff6300;
            border-bottom: 1px solid #ccc;

        }

    </style>
</head>
<body>
<div id="menu">
    <div style="margin:auto;width:800px;height: 30px;">
        <input id="txt_search_ipt" type="text" style="float: left;">
        <input type="button"style="height: 42px;float: left;background-color: #ff8e38;width: 103px;"value="淘宝一下">
    </div>
</div>
<script>
        function menuFixed(id) {
            var obj = document.getElementById(id);
            var _getHeight = obj.offsetTop;

            window.onscroll = function () {
                changePos(id, _getHeight);
            }
        }

    function changePos(id, height) {
        var obj = document.getElementById(id);
        var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
        if (scrollTop < height) {
            obj.style.position = 'relative';
        } else {
            obj.style.position = 'fixed';
        }
    }
    window.onload = function () {
        menuFixed('menu');
    }
</script>
</body>
</html>
